<template>
	<view>
		<view>
			<u-modal :show="show" title="审核店铺" content='是否审核通过？' @confirm="agree" showCancelButton="true"
				@cancel="reject"></u-modal>
			<u-empty v-if="list.length == 0" mode="list" icon="http://cdn.uviewui.com/uview/empty/list.png">
			</u-empty>
			<view class="card-list">
				<view class="card-item" v-for="(item, index) in list" :key="index" @longpress="showModal(item.id)">
					<!-- 左侧图片 -->
					<view class="card-image">
						<image :src="item.picture" :style="{ width: 100 + 'px', height: 80 + 'px' }"
							mode="aspectFill"></image>
					</view>
					<!-- 右侧文字 -->
					<view class="card-content">
						<view class="card-title">{{ item.shopName }}</view>
						<view style="position: absolute; padding-top: 6rpx;">
							<u-rate size="15" allowHalf="true" readonly="true" count="5"
								v-model="item.shopScore"></u-rate>
						</view>
						<view style="padding-left: 190rpx;">{{ item.shopScore }}</view>
						<view>地址：{{ item.shopAddress }}</view>
						<view class="card-description">{{ item.shopDescription }}</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[],
				isLastPage:false,
				page:1,
				length:10,
				show:false,
				shopId:"",
			}
		},
		onLoad() {
			let that = this;
			that.getList(that);
			
		},
		onReachBottom: function() {
			let that = this;
			if (that.isLastPage) {
				return;
			}
			that.page = that.page + 1;
			that.getList(that);
		},
		methods: {
			agree(){
				let that = this;
				that.show = false;
				that.$ajax(that.$url.agreeShop + "?id=" + that.shopId, "GET", null, function(resp){
					uni.showToast({
						icon:'none',
						title:'审核成功'
					})
					that.page = 1;
					that.length = 10;
					that.getList(that)
				})
			},
			reject(){
				this.show = false;
			},
			showModal(id) {
				let that = this;
				that.shopId = id;
				// 触发震动效果
				uni.vibrateShort();
				that.show = true;
			},
			getList(ref){
				let that = this;
				let data = {
					start: ref.page,
					length: ref.length,
				};
				this.$ajax(that.$url.searchUnCheckShopByPage, 'POST', data, function(resp) {
					let result = resp.data.result;
					if (result == null || result.length == 0) {
						ref.isLastPage = true;
						ref.page = ref.page - 1;
						uni.showToast({
							icon: 'none',
							title: '已经到底了'
						});
					} else {
						if (ref.page == 1) {
							ref.list = [];
						}
						ref.list = ref.list.concat(result);
					}
				});
			}
		}
	}
</script>

<style>
.card-list {
		position: absolute;
		margin-top: 20rpx;
		/* display: flex; */
		flex-direction: column;
		padding-bottom: 88rpx;
	}

	.card-item {
		display: flex;
		align-items: center;
		padding: 16px;
	}

	.card-image {
		margin-right: 16px;
	}

	.card-content {
		flex: 1;
	}

	.card-title {
		font-size: 18px;
		font-weight: bold;
		margin-bottom: 8px;
	}

	.card-description {
		font-size: 14px;
		color: #666;
	}
</style>
